<template>
	<coreshop-page :isBack="false" bgColor="rgba(0,0,0,0)" :isShowStatusBarHeight="false" showLoginModalDom needSkeleton
		:skeleton="skeleton" :skeletonLoading="loading">
		<view class="layout-home-page page-bg">
			<image class="home-bg" :src="handleStaticResources('/static/images/home-bg.jpg')"></image>
			<uv-navbar :title="shopConfigStore.config?.shopName"
				:bg-color="state.isScrollTop ? handleStaticResources('/static/images/home-bg.jpg') : 'rgba(0,0,0,0)'"
				imgMode="aspectFill" :titleStyle="{'color':'#fff','font-size':'32rpx'}">
				<!-- #ifndef MP-ALIPAY -->
				<template #left>
					<uv-icon name="search" size="22" color="#fff" @click="handleSearch"></uv-icon>
				</template>
				<!-- #endif -->
			</uv-navbar>

			<view class="content-box p-25">
				<CustomPage :coreshopData="state.coreshopData"></CustomPage>
			</view>

			<!-- 备案信息 -->
			<coreshop-copyright></coreshop-copyright>

			<!-- 弹框广告 -->
			<HomeAdpop></HomeAdpop>

			<!-- #ifdef MP-WEIXIN -->
			<button class="kufu-button" hover-class="none" open-type="contact" bindcontact="showChat"
				:session-from="state.kufuData">
				<uv-icon name="server-man" color="#d33123" :size="40"></uv-icon>
			</button>
			<!-- #endif -->
		</view>
	</coreshop-page>
</template>

<script setup lang="ts">
	import { onMounted, reactive, ref } from 'vue';
	import { onPageScroll, onShow, onShareAppMessage, onShareTimeline, onPullDownRefresh } from '@dcloudio/uni-app';
	import { queryPageConfig, queryUserInfo } from '@/core/api';
	import type { Response, PageConfigType, PageConfigItemsType, UserInfoType } from '@/core/models';
	import CustomPage from '@/pages/components/custom-page/index.vue';
	import HomeAdpop from '@/pages/components/custom-page/components/home-adpop/home-adpop.vue';
	import { handleStaticResources, handleRouteNavigateTo, getShareUrl, getDefaultShareData } from '@/core/utils';
	import { useLoadingFn } from '@/core/hooks';
	import { UserToken, onHomePageShow, shareUrl } from '@/core/consts';
	import { useUserInfoStore, useShopConfigStore } from '@/core/store';
	import { ShareClientEnum, ShareModelEnum, ShareEnum } from '@/core/enum';
	import { skeleton } from './skeleton'

	/** 获取项目配置 */
	const shopConfigStore = useShopConfigStore();

	/** 获取 用户数据 */
	const userInfoStore = useUserInfoStore();

	const loading = ref(true);

	const handleuQueryPageConfig = useLoadingFn(getPageConfig, loading);

	const state = reactive<{
		coreshopData : Array<PageConfigItemsType>;
		isScrollTop : boolean;
		showPage : boolean;
		shareUrl : string;
		kufuData : string;
	}>({
		coreshopData: [],
		isScrollTop: false,
		showPage: false,
		shareUrl: "",
		kufuData: ""
	})

	onShow(() => {
		/** 触发自定义onshow事件，让后代组件监听页面是都进入 */
		uni.$emit(onHomePageShow);
		console.log('ddd')
		uni.getNetworkType({
			success: function (res) {
				console.log(res.networkType);
			}
		});
		uni.onNetworkStatusChange(function (res) {
			console.log(res.isConnected);
			console.log(res.networkType);
		});
	})
	onPullDownRefresh(async () => {
		await queryHomePageConfig();
		uni.stopPullDownRefresh();
	});

	onMounted(async () => {
		queryHomePageConfig();
	})

	const queryHomePageConfig = async () => {
		handleuQueryPageConfig()
		if (uni.getStorageSync(UserToken)) {
			getUserInfo();
		}

		state.shareUrl = await getShareUrl({
			client: ShareClientEnum.wxMiNiProgram,
			url: shareUrl,
			type: ShareModelEnum.url,
			page: ShareEnum.index,
		});
		shopConfigStore.querySystemConfig();
	}

	async function getPageConfig() {
		const pageConfig : Response<PageConfigType> = await queryPageConfig({ code: 'mobile_home' });
		state.coreshopData = pageConfig.data?.items;
	}

	onPageScroll((e : any) => {
		state.isScrollTop = e.scrollTop > 10;
	})

	/** 获取用户信息 */
	const getUserInfo = async () => {
		const userInfo : Response<UserInfoType> = await queryUserInfo();
		if (userInfo.status) {
			userInfoStore.setUserInfo(userInfo?.data);
			state.kufuData = JSON.stringify({
				nickName: userInfo?.data?.nickName,
				tel: userInfo?.data?.mobile
			})
		}
	}

	/** 搜索 */
	const handleSearch = () => {
		handleRouteNavigateTo('/pages/search/search')
	}

	/** 分享 */
	onShareAppMessage(() => {
		return {
			title: getDefaultShareData().title,
			imageUrl: getDefaultShareData().imageUrl,
			path: state.shareUrl
		}
	});
	onShareTimeline(() => {
		return {
			title: getDefaultShareData().title,
			imageUrl: getDefaultShareData().imageUrl,
			path: state.shareUrl
		}
	});
</script>

<style lang="scss" scoped>
	@import './home.scss';
</style>